<template>
  <div>
    <Header></Header>
    <div class="main">
      <Goods
        v-for="obj in list"
        :key="obj.id"
        :goodslist='obj'
      ></Goods>
    </div>
    <Footer
      @checkbox='checkFn'
      :arr='list'
    ></Footer>
  </div>
</template>

<script>
import Header from './components/MyHeder'
import Goods from './components/MyGoods'
import Footer from './components/MyFooter'
export default {
  components: {
    Header,
    Goods,
    Footer
  },
  data () {
    return {
      list: []
    }
  },
  created () {
    this.$axios({
      url: '/api/cart'
    }).then(res => {
      console.log(res);
      this.list = res.data.list
    })
  },
  methods: {
    checkFn (bool) {
      this.list.forEach(obj => obj.goods_state = bool)
    }
  }
}
</script>
<style scoped>
.main {
  padding: 45px 0 50px 0;
}
</style>